import 'package:flutter/material.dart';
import 'package:mini_black_box/global/my_colors.dart';
import 'package:mini_black_box/global/my_styles.dart';

import 'childrens/recommend_screen.dart';

class HomeScreen extends StatefulWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

// 混入状态混合器
class _HomeScreenState extends State<HomeScreen>
    with SingleTickerProviderStateMixin {
  // tab 控制器
  late TabController _tabController;

  final List<Widget> _tabBarViews = [
    const Center(
      child: Text('tab1'),
    ),
    const RecommendScreen(),
  ];

  // 初始化状态
  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 2, vsync: this, initialIndex: 1);
  }

  @override
  Widget build(BuildContext context) {
    // 媒体查询
    final Size size = MediaQuery.of(context).size;

    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: SizedBox(
          height: size.height,
          width: size.width,
          child: Column(
            children: [
              // 顶部 动态||推荐切换标签、搜索图标和消息图标
              Container(
                padding: const EdgeInsets.all(defaultPadding),
                width: size.width,
                height: 60.0,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    SizedBox(
                      width: 140.0,
                      child: TabBar(
                        indicator: const BoxDecoration(),
                        controller: _tabController,
                        labelColor: primary,
                        labelStyle: const TextStyle(
                          fontSize: 18.0,
                          fontWeight: FontWeight.bold,
                        ),
                        unselectedLabelColor: lighter,
                        unselectedLabelStyle: const TextStyle(
                          fontSize: 16.0,
                          fontWeight: FontWeight.w200,
                        ),
                        tabs: const [
                          Text('动态'),
                          Text('推荐'),
                        ],
                      ),
                    ),
                    SizedBox(
                      width: 130.0,
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.end,
                        children: const [
                          Icon(Icons.search_outlined),
                          SizedBox(width: defaultPadding * 2),
                          Icon(Icons.mail_outline),
                        ],
                      ),
                    )
                  ],
                ),
              ),
              Expanded(
                child: TabBarView(
                  physics: const BouncingScrollPhysics(),
                  controller: _tabController,
                  children: _tabBarViews,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
